﻿<script setup lang="ts">
import { ref, watchEffect, withDefaults } from 'vue';

const props = withDefaults(
    defineProps<{
        visible: boolean;
        confirmMethod: ((...args: any[]) => any) & ((...args: any[]) => void);
        title: string;
        hideAllButton?: boolean;
        hideCancelButton?: boolean;
    }>(),
    {
        visible: false,
        confirmMethod: () => {},
        title: '',
        hideAllButton: false,
        hideCancelButton: false,
    }
);

const emits = defineEmits<{
    (e: 'close', value: boolean): void;
}>();

const show = ref(false);

const close = () => {
    show.value = false;
    emits('close', show.value);
};

watchEffect(() => {
    show.value = props.visible;
});
</script>

<template>
    <el-dialog v-model="show" :title="title" align-center width="400" @closed="close">
        <slot></slot>
        <template #footer v-if="!hideAllButton">
            <div class="dialog-footer">
                <el-button v-if="!hideCancelButton" @click="show = false">取消</el-button>
                <el-button type="primary" @click="confirmMethod">确认</el-button>
            </div>
        </template>
    </el-dialog>
</template>

<style scoped lang="scss"></style>
